<script setup>
import {onMounted, reactive, ref} from "vue";
import axios from "axios";
import {reqInstance} from "@/utils/request/index.js";
import {useRouter} from "vue-router";
import AddEdit from "@/views/contract/AddEdit.vue";
import dayjs from "dayjs";
import {useLoginStore} from "@/sotre/useLoginStore.js";
import Archive from "@/views/contract/archive.vue";
import {message} from "ant-design-vue";
import {useCompanyStore} from "@/sotre/useCompanyStore.js";

const dataSource = ref([])
const r = useRouter()

const step2txt = [
  '未提交',
  '审批中',
  '审批未通过',
  '审批通过',
  '未开始',
  '进行中',
  '已完成',
  '已终止',
]
const companyStore = useCompanyStore()

const getData = async () => {
  try {
    const res = await reqInstance({
      url: "/contract",
      params: {
        per_page: pageSize.value,
        page: current.value,
        com_id: companyStore.nowComID,
      },
      method: "get",
    })
    total.value = res?.data?.data?.pager?.TotalCount ?? 0
    console.log("total.value",total.value);
    dataSource.value = (res?.data?.data?.data ?? []).map((item) => {
      item.sign_data_txt = dayjs(item.sign_data).format('YYYY-MM-DD')
      item.market_user_txt = item.contract_users.filter((x) => {
        return x.user_type === 0
      }).map(u => {
        return u.user.name
      }).join(',')
      item.tech_user_txt = item.contract_users.filter((x) => {
        return x.user_type === 1
      }).map(u => {
        return u.user.name
      }).join(',')
      item.step_txt = step2txt[item.step]
      return item
    });
    console.log(dataSource);
    console.log(dataSource.value);
  } catch (e) {

  }
}

const childColumns = [
  {
    title: '类型',
    dataIndex: ['project_type_setting', 'type_title']
  },
  {
    title: '固定',
    dataIndex: 'fixed_amount'
  },
  {
    title: '分成',
    dataIndex: 'divide_amount'
  },
]

const columns = [
  {
    title: '合同编码',
    dataIndex: 'contract_no',
  },
  {
    title: '客户名称',
    // dataIndex: 'contract_customer.customer.com_name',
    dataIndex: ['contract_customer', 'customer', 'com_name'],
  },
  {
    title: '项目名称',
    dataIndex: 'project_name',
  },
  {
    title: '项目类型',
    // children:[
    //   {
    //     title: '类型',
    //     dataIndex: ['contract_project_type_fees','project_type_setting','type_title']
    //   },
    //   {
    //     title: '固定',
    //     dataIndex: ['contract_project_type_fees','fixed_amount']
    //   },
    //   {
    //     title: '分成',
    //     dataIndex: ['contract_project_type_fees','divide_amount']
    //   },
    // ],
    dataIndex: 'pro_type_fees'
  },
  {
    title: '签订日期',
    dataIndex: 'sign_data_txt',
  },
  {
    title: '市场负责人',
    dataIndex: 'market_user_txt',
  },
  {
    title: '技术负责人',
    dataIndex: 'tech_user_txt',
  },
  {
    title: '合同总金额',
    dataIndex: 'address',
    key: 'address',
  },
  {
    title: '应收账款',
    dataIndex: 'address',
  },
  {
    title: '已收账款',
    dataIndex: 'address',
  },
  {
    title: '状态',
    dataIndex: 'step_txt',
  },
  {
    dataIndex: 'action',
    title: '操作',
    key: 'action',
  },
]

const delOne = async (id) => {
  try {
    await reqInstance({
      url: "/contract/" + id,
      method: "delete",
    })
    message.success("删除成功")
    await getData()
  } catch (e) {

  }
}

const tableChange = (pagination)=>{
  current.value = pagination.current
  getData()
}

const sonDrawRef = ref()
const archiveDrawRef = ref()
const current = ref(1)
const pageSize = ref(10)
const total = ref(0)

onMounted(async () => {
  await companyStore.getCompany()
  await getData()
})
</script>

<template>
  <a-button type="primary" @click="sonDrawRef.createOpen()">新增</a-button>
  <add-edit ref="sonDrawRef" @create-completed="getData()"/>
  <archive ref="archiveDrawRef" @archive-completed="getData()"/>
  <a-table :dataSource="dataSource" :columns="columns"  :pagination="{
    current:current,
    pageSize:pageSize,
    total:total,
  }" @change="tableChange">
    <template #bodyCell="{ column, record }">
      <template v-if="column.dataIndex === 'pro_type_fees'">
        <!--        <ul>-->
        <!--          <template v-for="item in record.contract_project_type_fees">-->
        <!--            <li>{{ item.project_type_setting.type_title }} {{ item.fixed_amount }} {{ item.divide_amount }}</li>-->
        <!--          </template>-->
        <!--        </ul>-->
        <a-table :pagination="false"
                 :bordered="false"
                 style="margin: 0"
                 :dataSource="record.contract_project_type_fees" :columns="childColumns">

        </a-table>
      </template>
      <template v-if="column.dataIndex === 'action'">
        <a-button v-if="useLoginStore().isAdmin || record.step < 3" class="edit-btn"
                  @click="sonDrawRef.updateOpen(record)">编辑
        </a-button>
        <a-button v-if="useLoginStore().isAdmin && record.step === 3" class="edit-btn"
                  @click="archiveDrawRef.openDraw(record)">归档
        </a-button>
        <a-button v-if="useLoginStore().isAdmin" @click="delOne(record.id)">删除</a-button>
      </template>
    </template>
  </a-table>


</template>

<style scoped>
.edit-btn {
  //padding-right: 5px;
  margin-right: 5px;
}
</style>